/**
 *
 * 牌匾现场勘察
 *
 */
$(function () {
    // 初始化 Vue 实例
    const app = Vue.createApp({
        data() {
            return {
                // 表单数据
                formData: {
                    // caseNumber: "", //案件编号
                    caseTitle: "", //案件标题
                    caseImg: "", //案件图片
                    relevancyId: "", //关联主键（例：某一个广告的主键）
                    typeId: "", //类型主键 (7 广告；8 牌匾；9临街门面装饰；10 户外便民市场)
                    areaId: "", //区编码
                    streetId: "", //街道编码
                    location: "", //位置描述
                    eventType: "", //事件类型
                    eventInfo: "", //事件描述
                    processLimited: "", //处理时限

                    typeName: "", //类型主键 (7 广告；8 牌匾；9临街门面装饰；10 户外便民市场)
                    areaName: "", //类型主键 (7 广告；8 牌匾；9临街门面装饰；10 户外便民市场)
                    streetName: "", //类型主键 (7 广告；8 牌匾；9临街门面装饰；10 户外便民市场)
                    eventTypeName: "", //类型主键 (7 广告；8 牌匾；9临街门面装饰；10 户外便民市场)
                },
                // 关联信息
                showListAll: false,
                listAll: [],
                // 类型
                showType: false,
                typeList: [],
                //   所属区域
                showArea: false,
                areaList: [],
                //   所属区域
                showStreet: false,
                streetList: [],
                //   事件类型
                showEventType: false,
                eventTypeList: [],
                uploadUrl: `${globalApi.hosts}${globalApi.upload}`,
                showProcessLimited: false,
            };
        },
        mounted() {
            this.getArea()
            this.getEvent()
            this.getListAll()
            this.getType()

        },
        methods: {
            /**
             * 关联信息
             * @param
             */
            getListAll() {
                const vm = this;
                $.ajax({
                    url: `${globalApi.hosts}${listApi['plaque'].listAll}`,
                    type: 'GET',
                    dataType: 'json',
                    success: function (res) {
                        if (res.code === 200) {
                            vm.listAll = res.data
                        }
                    }
                })
            },
            /**
             * 获取类型
             * @param
             */
            getType(){
              const vm = this;
              $.ajax({
                  url: `${globalApi.hosts}${listApi['plaque'].advertising}`,
                  type: 'get',
                  dataType: 'json',
                  success: function (res) {
                      if (res.code == 200) {
                          vm.typeList = res.data;
                      }
                  }
              })
            },
            // 获取事件类型列表
            getEvent(){
                const vm = this;
              $.ajax({
                  url: globalApi.hosts + globalApi.nationTree,
                  method: "get",
                  dataType: "json",
                  success: function (res) {
                      if (res.code === 200) {
                          vm.eventTypeList = res.data;
                      }
                  }
              })
            },
            // 获取区域
            getArea(){
                console.log(23333)
                const vm = this;
                $.ajax({
                  url: `${globalApi.hosts}${globalApi.district}`,
                  method: "get",
                  dataType: "json",
                  success: function (res) {
                      if(res.code == 200){
                          vm.areaList = res.data.map(v => {
                              v.text = v.orgName
                              v.value = v.orgId
                              return v
                          });
                          vm.formData.areaId = vm.areaList[0].orgId;
                          vm.formData.areaName = vm.areaList[0].orgName;
                          vm.getStree(vm)
                      }
                  }
                })
            },
            // 获取街道
            getStree(vm){
              $.ajax({
                  url: `${globalApi.hosts}${globalApi.jdb}${vm.formData.areaId}`,
                  method: "get",
                  dataType: "json",
                  success: function (res) {
                      if(res.code == 200){
                          vm.streetList = res.data
                          if(vm.streetList.length > 0){

                              vm.formData.streetId = vm.streetList[0].jdbId
                              vm.formData.streetName = vm.streetList[0].jdbName
                          }
                          console.log('streetList', vm.streetList)
                      }
                  }
              })
            },
            onClickLeft() {
                history.back();
            },
            validator(val) {
                return /1\d{10}/.test(val);
            },
            validatorMessage(val) {
                return `${val} 不合法，请重新输入`;
            },
            asyncValidator(val) {
                return new Promise((resolve) => {
                    showLoadingToast("验证中...");

                    setTimeout(() => {
                        closeToast();
                        resolve(val === "1234");
                    }, 1000);
                });
            },
            // 关联信息保存
            saveListAll({selectedValues, selectedOptions}) {
                console.log("type", selectedValues, selectedOptions[0]);
                this.formData.relevancyId = selectedValues[0]
                this.formData.relevancyName = selectedOptions[0].advertisingTitle
                this.showListAll = false
            },
            // 类型保存
            saveType({selectedValues, selectedOptions}) {
                console.log("type", selectedValues, selectedOptions[0]);
                this.formData.typeId = selectedValues[selectedValues.length - 1]
                this.formData.typeName = selectedOptions[0].typeName
                this.showType = false
            },
            // 所属区域保存
            saveArea({selectedValues, selectedOptions}) {
                console.log("type", selectedValues, selectedOptions[0]);
                this.formData.areaId = selectedValues[0]
                this.formData.areaName = selectedOptions[0].orgName
                this.formData.streetId = ''
                this.formData.streetName = ''
                this.getStree(this)
                this.showArea = false
            },
            // 所属街道保存
            saveStreet({selectedValues, selectedOptions}) {
                console.log("type", selectedValues, selectedOptions[0]);
                this.formData.streetId = selectedValues[0]
                this.formData.streetName = selectedOptions[0].jdbName
                this.showStreet = false
            },
            // 事件类型
            saveEventType({selectedValues, selectedOptions}) {
                console.log("type", selectedValues, selectedOptions[0]);
                this.formData.eventType = selectedValues[selectedValues.length - 1]
                this.formData.eventTypeName = `${selectedOptions[0].text || selectedOptions[0].label} - ${selectedOptions[0].children.find(v => v.id === selectedValues[1]).label}`;
                this.showEventType = false
            },

            // 处理时限
            saveProcessLimited({selectedValues, selectedOptions}) {
                console.log("saveProcessLimited", selectedValues, selectedOptions[0]);
                this.formData.processLimited = `${selectedValues[0]}-${selectedValues[1]}-${selectedValues[2]}`
                this.showProcessLimited = false
            },

            onFailed(errorInfo) {
                console.log("failed", errorInfo);
            },
            saveForm(){
                console.log("saveForm", this.formData);
                $.ajax({
                    url: `${globalApi.hosts}${listApi['plaque'].case}`,
                    method: 'POST',
                    dataType: 'json',
                    contentType: 'application/json',
                    data: JSON.stringify(this.formData),
                    success: function (res) {
                        if (res.code === 200) {
                            vant.showNotify({type: 'primary', message: '立案成功'});
                            setTimeout(function () {
                                history.back();
                            }, 1000)
                        }
                        if(res.code === 500){
                            vant.showNotify({type: 'danger', message: res.msg});
                        }
                    }
                })
            },
            afterRead(file){
                const vm = this;
                console.log(file);
                const formData = new FormData();
                formData.append("file", file.file);
                try{
                    $.ajax({
                        url: `${globalApi.hosts}${globalApi.upload}`,
                        method: "POST",
                        data: formData,
                        // headers: {'Admin-Token': 'Bearer eyJhbGciOiJIUzUxMiJ9.eyJsb2dpbl91c2VyX2tleSI6IjkxNWUwMjMwLTUwMzItNDVjMS05MGQ2LWIwNzUyYzQ0OTJkMSJ9.OW5inch17_wxPzdCnwNBVJlPuIKu3WVAJX-frQQZ8Abe61gOk-IZOYQKMVs1eICQDUKUSnDwdbh0sWLCRQpWaQ'},
                        processData: false, // 不处理发送的数据
                        contentType: false,  // 不设置内容类型头
                        success: function (res) {
                            if (res.code === 200) {
                                vm.formData.caseImg = res.url;
                            }
                        }
                    })
                } catch(err) {
                    console.log('err', err)
                }
            }
        },
    });

    app.use(vant);
    app.mount("#app");

})